<template>
  <div class="page">
    <div class="enterpriseInfoTab">
      <ul>
        <li v-if="!three">
          <a
            @click="
              recruit(
                '/dlyrl/hr/recruitmentinformation/RecruitmentInformationList'
              )
            "
          >
            招聘信息
          </a>
        </li>
        <li class="defaultActive" v-if="three">
          <a
            @click="
              recruit(
                '/dlyrl/hr/recruitmentinformation/RecruitmentInformationList'
              )
            "
          >
            招聘信息
          </a>
        </li>
        <li v-if="!one">
          <a
            @click="
              recruit(
                '/dlyrl/hr/recruitmentinformation/RecruitmentInformationList?type=' +
                  0
              )
            "
          >
            普通招聘
          </a>
        </li>
        <li class="defaultActive" v-if="one">
          <a
            @click="
              recruit(
                '/dlyrl/hr/recruitmentinformation/RecruitmentInformationList?type=' +
                  0
              )
            "
          >
            普通招聘
          </a>
        </li>
        <li v-if="!two">
          <a
            @click="
              recruit(
                '/dlyrl/hr/recruitmentinformation/RecruitmentInformationList?type=' +
                  1
              )
            "
          >
            自主招聘
          </a>
        </li>
        <li class="defaultActive" v-if="two">
          <a
            @click="
              recruit(
                '/dlyrl/hr/recruitmentinformation/RecruitmentInformationList?type=' +
                  1
              )
            "
          >
            自主招聘
          </a>
        </li>
        <li>
          <a
            @click="
              recruit(
                '/dlyrl/hr/agencyrecruitment/AgencyRecruitmentInformationList'
              )
            "
          >
            代理招聘
          </a>
        </li>
        <li>
          <a
            @click="recruit('/dlyrl/hr/laborDispatching/laborDispatchingList')"
          >
            劳务派遣
          </a>
        </li>
      </ul>
    </div>
    <el-form
      size="small"
      :inline="true"
      class="query-form"
      ref="searchForm"
      :model="searchForm"
      @keyup.enter.native="refreshList()"
      @submit.native.prevent
    >
      <!-- 搜索框-->
      <el-form-item prop="enterpriseInformation.id">
        <GridSelect
          title="选择企业"
          placeholder="请选择企业"
          labelName="companyName"
          labelValue="id"
          :value="searchForm.enterpriseInformation.id"
          :limit="1"
          size="small"
          @getValue="
            (value) => {
              searchForm.enterpriseInformation.id = value;
            }
          "
          :columns="[
            {
              prop: 'id',
              label: '主键',
            },
            {
              prop: 'companyName',
              label: '企业名称',
            },
          ]"
          :searchs="[
            {
              prop: 'id',
              label: '主键',
            },
            {
              prop: 'companyName',
              label: '企业名称',
            },
          ]"
          dataListUrl="/dlyrl/hr/enterpriseinformation/enterpriseInformation/list"
          entityBeanName="enterpriseInformation"
          queryEntityUrl="/dlyrl/hr/enterpriseinformation/enterpriseInformation/queryById"
        >
        </GridSelect>
      </el-form-item>
      <el-form-item prop="enterpriseUserInformation.id">
        <GridSelect
          title="选择发布人"
          placeholder="请选择发布人"
          labelName="userName"
          labelValue="id"
          :value="searchForm.enterpriseUserInformation.id"
          :limit="1"
          size="small"
          @getValue="
            (value) => {
              searchForm.enterpriseUserInformation.id = value;
            }
          "
          :columns="[
            {
              prop: 'id',
              label: '主键',
            },
            {
              prop: 'userName',
              label: '用户名',
            },
          ]"
          :searchs="[
            {
              prop: 'id',
              label: '主键',
            },
            {
              prop: 'userName',
              label: '用户名',
            },
          ]"
          dataListUrl="/dlyrl/hr/enterpriseuserinformation/enterpriseUserInformation/list"
          entityBeanName="enterpriseUserInformation"
          queryEntityUrl="/dlyrl/hr/enterpriseuserinformation/enterpriseUserInformation/queryById"
        >
        </GridSelect>
      </el-form-item>
      <el-form-item prop="monthlyWage">
        <el-input
          size="small"
          v-model="searchForm.monthlyWage"
          placeholder="月用工工资"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item prop="positionName">
        <el-input
          size="small"
          v-model="searchForm.positionName"
          placeholder="岗位名称"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item prop="workAddress">
        <el-input
          size="small"
          v-model="searchForm.workAddress"
          placeholder="工作地址"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item style="float: right">
        <el-button type="primary" @click="refreshList()" size="small"
          >查询</el-button
        >
        <el-button @click="resetSearch()" size="small">重置</el-button>
      </el-form-item>
    </el-form>
    <!-- 导入导出-->
    <el-dialog title="导入Excel" :visible.sync="isImportCollapse">
      <el-form
        size="small"
        :inline="true"
        v-show="isImportCollapse"
        ref="importForm"
      >
        <el-form-item>
          <el-button type="default" @click="downloadTpl()" size="small"
            >下载模板</el-button
          >
        </el-form-item>
        <el-form-item prop="loginName">
          <el-upload
            class="upload-demo"
            :action="`${this.$http.BASE_URL}/dlyrl/hr/recruitmentinformation/recruitmentInformation/import`"
            :on-success="uploadSuccess"
            :show-file-list="true"
          >
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">
              只允许导入“xls”或“xlsx”格式文件！
            </div>
          </el-upload>
        </el-form-item>
      </el-form>
    </el-dialog>
    <div class="bg-white top">
      <el-row>
        <el-button
          v-if="
            hasPermission(
              'dlyrl:hr:recruitmentinformation:recruitmentInformation:add'
            )
          "
          type="primary"
          size="small"
          icon="el-icon-plus"
          @click="add()"
          >新建</el-button
        >
        <el-button
          v-if="
            hasPermission(
              'dlyrl:hr:recruitmentinformation:recruitmentInformation:edit'
            )
          "
          type="warning"
          size="small"
          icon="el-icon-edit-outline"
          @click="edit()"
          :disabled="dataListSelections.length != 1"
          plain
          >修改</el-button
        >
        <el-button
          v-if="
            hasPermission(
              'dlyrl:hr:recruitmentinformation:recruitmentInformation:del'
            )
          "
          type="danger"
          size="small"
          icon="el-icon-delete"
          @click="del()"
          :disabled="dataListSelections.length <= 0"
          plain
          >删除
        </el-button>
        <el-button-group class="pull-right">
          <el-button
            v-if="
              hasPermission(
                'dlyrl:hr:recruitmentinformation:recruitmentInformation:import'
              )
            "
            type="default"
            size="small"
            icon="el-icon-upload2"
            title="导入"
            @click="isImportCollapse = !isImportCollapse"
          ></el-button>
          <el-button
            v-if="
              hasPermission(
                'dlyrl:hr:recruitmentinformation:recruitmentInformation:export'
              )
            "
            type="default"
            size="small"
            icon="el-icon-download"
            title="导出"
            @click="exportExcel()"
          ></el-button>
          <el-button
            type="default"
            size="small"
            icon="el-icon-refresh"
            @click="refreshList"
          >
          </el-button>
        </el-button-group>
      </el-row>
      <el-table
        :cell-style="cellStyle"
        style="border: 1px solid #d6cfe2"
        :header-cell-class-name="cellHeadStyle"
        :row-class-name="tableRowClassName"
        :data="dataList"
        size="small"
        height="calc(100% - 80px)"
        @selection-change="selectionChangeHandle"
        @sort-change="sortChangeHandle"
        v-loading="loading"
        class="table"
      >
        <el-table-column
          type="selection"
          header-align="center"
          align="center"
          width="50"
        >
        </el-table-column>
        <el-table-column
          prop="enterpriseInformation.companyName"
          show-overflow-tooltip 
          fixed="left"
          width="130"
          label="企业"
        >
          <!-- <template slot-scope="scope">
            <el-link
              type="primary"
              :underline="false"
              v-if="
                hasPermission(
                  'dlyrl:hr:recruitmentinformation:recruitmentInformation:edit'
                )
              "
              @click="edit(scope.row.id)"
              >{{ scope.row.enterpriseInformation.companyName }}</el-link
            >
            <el-link
              type="primary"
              :underline="false"
              v-else-if="
                hasPermission(
                  'dlyrl:hr:recruitmentinformation:recruitmentInformation:view'
                )
              "
              @click="view(scope.row.id)"
              >{{ scope.row.enterpriseInformation.companyName }}</el-link
            >
            <span v-else>{{
              scope.row.enterpriseInformation.companyName
            }}</span>
          </template> -->
           <template slot-scope="scope">
            <el-link
              type="primary"
              :underline="false"
              @click="view(scope.row.id)"
              >{{ scope.row.enterpriseInformation.companyName }}</el-link
            >
          </template>
        </el-table-column>
        <el-table-column
          prop="enterpriseUserInformation.userName"
          show-overflow-tooltip 
          width="130px"
          label="发布人"
        >
        </el-table-column>
        <el-table-column
          prop="monthlyWage"
          show-overflow-tooltip 
          width="130px"
          label="月用工工资"
        >
        </el-table-column>
        <el-table-column
          prop="recruitingNumbers"
          show-overflow-tooltip 
          width="130px"
          label="招聘人数"
        >
        </el-table-column>
        <el-table-column
          prop="positionName"
          show-overflow-tooltip 
          width="130px"
          label="岗位名称"
        >
        </el-table-column>
        <el-table-column
          prop="workAddress"
          show-overflow-tooltip 
          width="130px"
          label="工作地址"
        >
        </el-table-column>
        <el-table-column
          prop="workTime"
          show-overflow-tooltip 
          width="130px"
          label="工作时间"
        >
        </el-table-column>
        <el-table-column
          prop="jobDescription"
          show-overflow-tooltip 
          width="130px"
          label="岗位描述"
        >
        </el-table-column>
        <el-table-column
          prop="sex"
          show-overflow-tooltip 
          align="center"
          label="性别"
        >
          <template slot-scope="scope">
            {{ $dictUtils.getDictLabel("sex", scope.row.sex, "-") }}
          </template>
        </el-table-column>
        <el-table-column
          prop="age"
          show-overflow-tooltip 
          align="center"
          label="年龄"
        >
        </el-table-column>
        <el-table-column
          prop="gradeRatings"
          show-overflow-tooltip 
          width="130px"
          label="等级评级"
        >
          <template slot-scope="scope">
            {{
              $dictUtils.getDictLabel(
                "grade_ratings",
                scope.row.gradeRatings,
                "-"
              )
            }}
          </template>
        </el-table-column>
        <el-table-column
          prop="otherRecruitmentRequirements"
          show-overflow-tooltip 
          width="130px"
          label="其他招聘条件"
        >
        </el-table-column>
        <el-table-column
          prop="socialBenefits"
          show-overflow-tooltip 
          width="130px"
          label="福利待遇"
        >
          <!-- （以逗号隔开） -->
        </el-table-column>
        <el-table-column
          prop="jobtype.name"
          show-overflow-tooltip 
          width="130px"
          label="岗位类型"
        >
        </el-table-column>
        <el-table-column
          prop="recruitmentType"
          show-overflow-tooltip 
          width="130px"
          label="招聘岗位类型"
        >
          <template slot-scope="scope">
            {{
              $dictUtils.getDictLabel(
                "recruitment_type",
                scope.row.recruitmentType,
                "-"
              )
            }}
          </template>
        </el-table-column>
        <el-table-column
          prop="education"
          show-overflow-tooltip 
          label="学历"
        >
          <template slot-scope="scope">
            {{ $dictUtils.getDictLabel("nature", scope.row.education, "-") }}
          </template>
        </el-table-column>
        <el-table-column
          prop="award"
          show-overflow-tooltip 
          width="130px"
          label="奖励金额"
        >
        </el-table-column>
        <el-table-column
          prop="groupleader.name"
          show-overflow-tooltip 
          label="组长"
        >
        </el-table-column>
        <el-table-column
          prop="groupLeaderDistributionRatio"
          show-overflow-tooltip 
          width="150px"
          label="组长分配比例(%)"
        >
        </el-table-column>
        <el-table-column
          prop="postcollector.name"
          show-overflow-tooltip 
          width="130px"
          label="岗位收集员"
        >
        </el-table-column>
        <el-table-column
          prop="postcollectorDistributionRatio"
          show-overflow-tooltip 
          width="180px"
          label="岗位收集员分配比例(%)"
        >
        </el-table-column>
        <el-table-column
          prop="negotiation.name"
          show-overflow-tooltip 
          width="130px"
          label="商机洽谈员"
        >
        </el-table-column>
        <el-table-column
          prop="negotiationDistributionRatio"
          show-overflow-tooltip 
          width="180px"
          label="商机洽谈员分配比例(%)"
        >
        </el-table-column>
        <el-table-column
          prop="recruitment.name"
          show-overflow-tooltip 
          width="140px"
          label="招聘/面试员"
        >
        </el-table-column>
        <el-table-column
          prop="recruitmentDistributionRatio"
          show-overflow-tooltip 
          width="185px"
          label="招聘/面试员分配比例(%)"
        >
        </el-table-column>
        <el-table-column
          prop="businessNegotiation.name"
          show-overflow-tooltip 
          width="130px"
          label="人才安排员 "
        >
        </el-table-column>
        <el-table-column
          prop="businessNegotiationDistributionRatio"
          show-overflow-tooltip 
          width="180px"
          label="人才安排员分配比例(%)"
        >
        </el-table-column>
        <el-table-column
          prop="financingStage"
          show-overflow-tooltip 
          width="130px"
          label="融资阶段"
        >
          <template slot-scope="scope">
            {{
              $dictUtils.getDictLabel(
                "financing_stage",
                scope.row.financingStage,
                "-"
              )
            }}
          </template>
        </el-table-column>
        <el-table-column
          prop="companySize"
          show-overflow-tooltip 
          width="130px"
          label="公司规模"
        >
          <template slot-scope="scope">
            {{
              $dictUtils.getDictLabel(
                "ccompany_size",
                scope.row.companySize,
                "-"
              )
            }}
          </template>
        </el-table-column>
        <el-table-column
          prop="workexperience"
          show-overflow-tooltip 
          width="130px"
          label="工作经验"
        >
        </el-table-column>
        <el-table-column
          prop="sendEnterprise.companyName"
          show-overflow-tooltip 
          width="130px"
          label="工作企业"
        >
        </el-table-column>
        <el-table-column
          prop="remarks"
          show-overflow-tooltip 
          width="130px"
          label="备注信息"
        >
        </el-table-column>
        <!-- <el-table-column
          header-align="center"
          align="center"
          fixed="right"
          :key="Math.random()"
          width="200"
          label="操作"
        >
          <template slot-scope="scope">
            <el-button
              v-if="
                hasPermission(
                  'dlyrl:hr:recruitmentinformation:recruitmentInformation:view'
                )
              "
              type="text"
              icon="el-icon-view"
              size="mini"
              @click="view(scope.row.id)"
              >查看</el-button
            >
            <el-button
              v-if="
                hasPermission(
                  'dlyrl:hr:recruitmentinformation:recruitmentInformation:edit'
                )
              "
              type="text"
              icon="el-icon-edit"
              size="mini"
              @click="edit(scope.row.id)"
              >修改</el-button
            >
            <el-button
              v-if="
                hasPermission(
                  'dlyrl:hr:recruitmentinformation:recruitmentInformation:del'
                )
              "
              type="text"
              icon="el-icon-delete"
              size="mini"
              @click="del(scope.row.id)"
              >删除</el-button
            >
          </template>
        </el-table-column> -->
      </el-table>
      <el-pagination
        @size-change="sizeChangeHandle"
        @current-change="currentChangeHandle"
        :current-page="pageNo"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="pageSize"
        :total="total"
        background
        layout="total, sizes, prev, pager, next, jumper"
      >
      </el-pagination>
    </div>
    <!-- 弹窗, 新增 / 修改 -->
    <RecruitmentInformationForm
      ref="recruitmentInformationForm"
      @refreshDataList="refreshList"
    ></RecruitmentInformationForm>
  </div>
</template>

<script>
import tableStyles from "../../../../../utils/mixins.js";
import RecruitmentInformationForm from "./RecruitmentInformationForm";
import GridSelect from "@/components/gridSelect";
export default {
  mixins: [tableStyles],
  data() {
    return {
      searchForm: {
        enterpriseInformation: {
          id: "",
        },
        enterpriseUserInformation: {
          id: "",
        },
        monthlyWage: "",
        positionName: "",
        workAddress: "",
      },
      dataList: [],
      pageNo: 1,
      pageSize: 10,
      total: 0,
      orderBy: "",
      dataListSelections: [],
      isImportCollapse: false,
      loading: false,
      one: false,
      two: false,
      three: false,
    };
  },
  components: {
    GridSelect,
    RecruitmentInformationForm,
  },
  activated() {
    this.refreshList();
  },
  methods: {
    //
    recruit(url) {
      this.$router.push(url);
    },
    // 获取数据列表
    refreshList() {
      var recruitmentType = this.$route.query.type;
      console.log("recruitmentType", recruitmentType);
      if (recruitmentType == 0) {
        this.one = true;
        this.two = false;
        this.three = false;
      } else if (recruitmentType == 1) {
        this.two = true;
        this.one = false;
        this.three = false;
      } else {
        this.three = true;
        this.one = false;
        this.two = false;
      }
      this.loading = true;
      this.$http({
        url: "/dlyrl/hr/recruitmentinformation/recruitmentInformation/list",
        method: "get",
        params: {
          pageNo: this.pageNo,
          pageSize: this.pageSize,
          orderBy: this.orderBy,
          recruitmentType: recruitmentType,
          ...this.searchForm,
        },
      }).then(({ data }) => {
        if (data && data.success) {
          this.dataList = data.page.list;
          this.total = data.page.count;
          this.loading = false;
        }
      });
    },
    // 每页数
    sizeChangeHandle(val) {
      this.pageSize = val;
      this.pageNo = 1;
      this.refreshList();
    },
    // 当前页
    currentChangeHandle(val) {
      this.pageNo = val;
      this.refreshList();
    },
    // 多选
    selectionChangeHandle(val) {
      this.dataListSelections = val;
    },

    // 排序
    sortChangeHandle(obj) {
      if (obj.order === "ascending") {
        this.orderBy = obj.prop + " asc";
      } else if (obj.order === "descending") {
        this.orderBy = obj.prop + " desc";
      } else {
        this.orderBy = "";
      }
      this.refreshList();
    },
    // 新增
    add() {
      this.$refs.recruitmentInformationForm.init("add", "");
    },
    // 修改
    edit(id) {
      id =
        id ||
        this.dataListSelections.map((item) => {
          return item.id;
        })[0];
      this.$refs.recruitmentInformationForm.init("edit", id);
    },
    // 查看
    view(id) {
      this.$refs.recruitmentInformationForm.init("view", id);
    },
    // 删除
    del(id) {
      let ids =
        id ||
        this.dataListSelections
          .map((item) => {
            return item.id;
          })
          .join(",");
      this.$confirm(`确定删除所选项吗?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        this.loading = true;
        this.$http({
          url: "/dlyrl/hr/recruitmentinformation/recruitmentInformation/delete",
          method: "delete",
          params: { ids: ids },
        }).then(({ data }) => {
          if (data && data.success) {
            this.$message.success(data.msg);
            this.refreshList();
          }
          this.loading = false;
        });
      });
    },
    // 导入成功
    uploadSuccess(res, file) {
      if (res.success) {
        this.$message.success({
          dangerouslyUseHTMLString: true,
          message: res.msg,
        });
      } else {
        this.$message.error(res.msg);
      }
    },
    // 下载模板
    downloadTpl() {
      this.$utils.download(
        "/dlyrl/hr/recruitmentinformation/recruitmentInformation/import/template"
      );
    },
    exportExcel() {
      let params = {
        ...this.searchForm,
      };
      this.$utils.download(
        "/dlyrl/hr/recruitmentinformation/recruitmentInformation/export",
        params
      );
    },
    resetSearch() {
      this.$refs.searchForm.resetFields();
      this.refreshList();
    },
  },
};
</script>
<style scoped>
ul {
  margin: 0;
}
</style>